<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.2/css/bootstrap.css">
</head>
<body  ng-app="myApp">

<div class="container">
    <h5>指令属性scope属性值传递示例</h5>
    <label>输入网址:</label>
    <input type="text" ng-model="theirUrl">
    <div my-directive
         some-attr="theirUrl"
         my-link-text="点我跳转到我如入的地址"></div>
</div>

<script src="http://cdn.bootcss.com/angular.js/1.3.8/angular.js" type="text/javascript"></script>
<script>

    angular.module('myApp', []).directive('myDirective', function() {
                return {
                    restrict: 'A',
                    replace: true,
                    scope: {
                        myUrl: '=someAttr',
                        myLinkText: '@'
                    },
                    template: '\
                      <div class="row">\
                        <label>输入的网址:</label>\
                        <input type="text" ng-model="myUrl" />\
                        <a href="{{myUrl}}" target="_blank">{{myLinkText}}</a>\
                      </div>\
                        '
                }
            });
</script>

</body>
</html>